<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		<script type="text/javascript" src="../js/global.js"></script>
	</head>
	<body>
		<fieldset class="layui-elem-field layui-field-title" style="margin-top: 10px;">
			<legend>系統功能模块维护</legend>
		</fieldset>
		<div id="searchePage" class="layui-form-item" style="margin-top: 10px;margin-left: 10px;">
			<form class="layui-form" method="post" onsubmit="return false;">
				<label class="layui-form-mid">用户名:</label>
				<div class="layui-input-inline" style="width: 100px;">
					<input type="text" id="loginname" name="loginname" autocomplete="off"
						class="layui-input" />
				</div>
				<label class="layui-form-mid">起止时间:</label>
				<div class="layui-input-inline" style="width: 100px;">
					<input type="text" name="beginDate" id="beginDate" placeholder="yyyy-MM-dd"
						autocomplete="off" class="layui-input" />
				</div>
				<label class="layui-form-mid">--</label>
				<div class="layui-input-inline" style="width: 100px;">
					<input type="text" name="endDate" id="endDate" placeholder="yyyy-MM-dd"
						autocomplete="off" class="layui-input" />
				</div>
				<label class="layui-form-mid">是否锁定:</label>
				<div class="layui-input-inline" style="width: 100px;">
					<select id="islockout" name="islockout">
						<option value="">请选择</option>
						<option value="是">是</option>
						<option value="否">否</option>
					</select>
				</div>
				<!-- <label class="layui-form-mid">排序:</label>
				<div class="layui-input-inline" style="width: 100px;">
					<select id="ord" name="orderBy">
						<option value="">请选择</option>
						<option value="CreateTime">创建时间</option>
						<option value="LastLoginTime">最后登录时间</option>
					</select>
				</div> -->
				<div class="layui-input-inline" style="width: 70px;">
					<button class="layui-btn" id="search" data-type="reload">搜索</button>
				</div>
				<!-- <div class="layui-input-inline">
					<button class="layui-btn" lay-event="createUser" id="add">添加</button>
				</div> -->
			</form>
		</div>
		<!--
        	数据表格<table class="layui-hide" id="demo" lay-filter="test">
        -->
		
		</table>
		<!--行内工具栏-->
		<script type="text/html" id="barDemo">
			<!--<a class="layui-btn layui-btn-xs layui-btn-primary" lay-event="setRole">角色</a>
			
			{{# if(d.islockout=='是'){ }}
				<a class="layui-btn layui-btn-warm layui-btn-xs layui-btn-disabled">密码重置</a>
			{{# }else{ }}
				<a class="layui-btn layui-btn-warm layui-btn-xs" lay-event="rePwd">密码重置</a>
			{{# } }}-->
		</script>
		
		<script type="text/html" id="btn_switch">
			<!-- {{# if(d.islockout=='否'){ }}
				<input type="checkbox" name="loginname" uid="{{d.id}}" value="{{d.loginname}}" lay-filter="islockout" lay-skin="switch" lay-text="解锁|锁定">
			{{# }else{ }}
				<input type="checkbox" name="loginname" uid="{{d.id}}" value="{{d.loginname}}" lay-filter="islockout" lay-skin="switch" lay-text="解锁|锁定" checked>
			{{# } }} -->
		</script>
		<!--
        	编辑弹层
        -->
        <div id="updatePage" style="display: none;">
        	<form class="layui-form" action="" onsubmit="return false" lay-filter="updateForm">
			<div class="layui-form-item" style="margin-top: 30px;">
				<label class="layui-form-label"><span style="color: red;">*</span>登录名:</label>
				<div class="layui-input-inline" style="width: 350px;">
					<input type="hidden" name="id" />
					<input type="text" name="loginname"
						lay-verify="uname" class="layui-input" disabled/>
				</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label"><span style="color: red;">*</span>邮箱:</label>
				<div class="layui-input-inline" style="width: 350px;">
					<input type="text" placeholder="请输入邮箱" name="protectemail"
						lay-verify="email" class="layui-input" />
				</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label"><span style="color: red;">*</span>手机号:</label>
				<div class="layui-input-inline" style="width: 350px;">
					<input type="text" placeholder="请输入手机号" name="protectmtel"
						lay-verify="ph" class="layui-input" />
				</div>
			</div>
			<div class="layui-btn-container" style="text-align: center;">
				<button class="layui-btn" id="transmit" lay-submit="" lay-filter="updateUser">保存</button>
			</div>
			</form>
        </div>
        <!--
        	角色穿梭框
        -->
        <div id="role_tarsfer"  style="display: none;">
        	<div id="role_demo" class="demo-transfer" style="margin-top: 30px;margin-left: 50px;"></div>
        </div>
        
	</body>
	<script>
			layui.use(['table','form','layer','transfer'],function(){
				var table=layui.table,
				form=layui.form,
				$=layui.$,
				layer=layui.layer,
				transfer=layui.transfer;
				
				//获取该用户在模块页面拥有的权限
				$.ajax({
					type : "get",
					url : globalData.server+"modules/getPermissionsByModuleId",
					data:{
						id:globalData.getCurPageModuleId()
					},//需要传递到服务端的数据
					dataType:'json',//服务端响应数据类型
					xhrFields: {
						withCredentials: true
					},
					beforeSend: function(request) {
						request.setRequestHeader("token", globalData.getCurToken());
					},
					success : function(res) {
						//转换对象数组
						var permissionids=JSON.parse(globalData.getCurUserPermissions());
						//创建权限对象数组
						var permission_arr={};
						//遍历用户权限id
						for(var i=0;i<permissionids.length;i++){
							
							//遍历该模块的全部权限
							for(var j=0;j<res.length;j++){
								console.log(res[j]);
								 if(permissionids[i]==res[j].permissionid){
								 	permission_arr[i]=res[j];
								 }
							}
						}
						//遍历数据
						$.each(permission_arr,function(n,value){
							switch (value.permissionvalue){
								case 'user:query':
								var tableTarget='<table class="layui-hide" id="demo" lay-filter="test">';
								$("body").append(tableTarget);
									break;
								case 'user:lockUser':
								var button='{{# if(d.islockout=="否"){ }}'+
										'<input type="checkbox" name="loginname" uid="{{d.id}}" value="{{d.loginname}}" lay-filter="islockout" lay-skin="switch" lay-text="解锁|锁定">'+
									'{{# }else{ }}'+
										'<input type="checkbox" name="loginname" uid="{{d.id}}" value="{{d.loginname}}" lay-filter="islockout" lay-skin="switch" lay-text="解锁|锁定" checked>'+
									'{{# } }}';
								$("#btn_switch").append(button);
									break;
								case 'user:add':
								var button='<div class="layui-input-inline">'+
								'<button class="layui-btn" lay-event="createUser" id="addPage">添加</button></div>';
								$("#searchePage").append(button);
									break;
								case 'user:updateRole':
								var button='<a class="layui-btn layui-btn-xs layui-btn-primary" lay-event="setRole">角色</a>';
								$("#barDemo").append(button);
									break;
								case 'user:resetPassword':
								var button='{{# if(d.islockout=="是"){ }}'+
									'<a class="layui-btn layui-btn-warm layui-btn-xs layui-btn-disabled">密码重置</a>'+
								'{{# }else{ }}'+
									'<a class="layui-btn layui-btn-warm layui-btn-xs" lay-event="rePwd">密码重置</a>'+
								'{{# } }}';
								$("#barDemo").append(button);
									break;
								case 'user:delete':
								var button='<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>';
								$("#barDemo").append(button);
									break;
								case 'user:updateTelEmail':
								var button='<a class="layui-btn layui-btn-xs" lay-event="update">编辑</a>';
								$("#barDemo").append(button);
									break;
							}
						});
						
						//渲染数据表格
						table.render({
							elem:'#demo',
							height:400,//http://192.168.1.250:83/api/GetUsers,GetUsersLayUI
							url:globalData.server+'user',
							method:"get",
							headers: {token: globalData.getCurToken()},//设置请求头
							title:"用户表",
							page:true,
							cols:[
								[
								{
									field:'loginname',
									title:'用户名',
									width:120,
									sort:true,
									align:'center'
								},{
									field:'protectemail',
									title:'邮箱',
									width:120
								},{
									field:'protectmtel',
									title:'手机号',
									width:100,
									align:'center'
								},{
									field:'createtime',
									title:'创建时间',
									width:180,
									align:'center'
								},{
									field:'lastlogintime',
									title:'最后登录时间',
									width:180,
									align:'center'
								},{
									field:'islockout',
									title:'是否锁定',
									templet:$("#btn_switch"),
									width:120,
									align:'center'
								},{
									field:'locktime',
									title:'锁定时间',
									width:180,
									align:'center'
								},{
									title:'操作',
									width:240,
									align:"center",
									toolbar:'#barDemo'
								}
								]
							],
							id:"testReload",
							done:function(res,curr,count){
								
							}
						});
						
						//添加用户弹出层
						$("#addPage").on('click',function(){
							layer.open({
								type:2,
								title:'添加用户',
								area: ['500px', '400px'],
								content:'user_add.html',
								end:function(){
									//alert(1)
								}
							});
						});
					}
				});
				
				active={
					reload:function(){
						var loginname=$("#loginname");
						var beginDate=$("#beginDate");
						var endDate=$("#endDate");
						var islockout=$("#islockout");
						//var orderBy=$("#ord");
						table.reload('testReload',{
							where:{
								'loginname':loginname.val(),
								'beginDate':beginDate.val(),
								'endDate':endDate.val(),
								'islockout':islockout.val()
							//	'orderBy':orderBy.val()
							},
							curr:{
								page:1
							}
						});
					}
				};
				
				//查询操作
				$("#search").on('click',function(){
					var type=$(this).data('type');
					active[type]?active[type].call(this):'';
				})
				
				
//				table.on('toolbar(test)',function(obj){
//					switch(obj.event){
//						case 'batch':
//						var ids=[];
//						for(var i=0;i<pData.length;i++){
//							var obj=pData[i];
//							ids.push(obj.LoginName);
//						}
//						layer.alert(ids.join(','));
//						break;
//						case 'createUser':
//						layer.msg("创建用户");
//						break;
//					}
//				});
				//行内工具栏监听
				table.on('tool(test)',function(obj){
					var data=obj.data;
					switch(obj.event){
						case 'del':{
						layer.confirm('确认删除该用户吗['+data.loginname+']的信息吗?',{icon:7},function(index){
							layer.close(index);
							
							$.ajax({
								type : "delete",
								url : globalData.server+"user",
								data:{
									id:data.id
								},//需要传递到服务端的数据
								dataType:'json',//服务端响应数据类型
								xhrFields: {
									withCredentials: true
								},
								beforeSend: function(request) {
									request.setRequestHeader("token", globalData.getCurToken());
								},
								success : function(res) {
									if(res.success){
										layer.msg(res.msg,{icon:1,time:2000},function(index){
											table.reload('testReload');
										});
										
									}else{
										layer.msg(res.msg,{icon:2,time:2000});
									}
							}
							});
							
						});
						}
						break;
						case 'update':
						//layer.msg('您准备更新['+data.LoginName+']的信息');
						//表单赋值
						form.val('updateForm',data);
						var update_index=layer.open({
							type:1,
							title:'您正在修改用户['+data.loginname+']的信息',
							area: ['500px', '300px'],
							content: $('#updatePage'),
							success:function(layero,index){
								//修改提交
								form.on('submit(updateUser)',function(obj){
									//console.log(obj.field);
									$.ajax({
										type : "put",
										url : globalData.server+"user",
										data:obj.field,//需要传递到服务端的数据
										dataType:'json',//服务端响应数据类型
										xhrFields: {
											withCredentials: true
										},
										beforeSend: function(request) {
											request.setRequestHeader("token", globalData.getCurToken());
										},
										success : function(res) {
											if(res.success){
												layer.msg(res.msg,{icon:1,time:2000},function(index){
													layer.close(update_index);
													table.reload('testReload');
												});
												
											}else{
												layer.msg(res.msg,{icon:2,time:2000});
											}
									}
									});
								});
							}
						});
						
						break;
						case 'rePwd':
						layer.confirm('确认重置密码?',{icon:7},function(index){
							layer.close(index);
							
							$.ajax({
								type : "get",
								url : globalData.server+"user/resetPassword",
								data:{
									id:data.id
								},//需要传递到服务端的数据
								dataType:'json',//服务端响应数据类型
								xhrFields: {
									withCredentials: true
								},
								beforeSend: function(request) {
									request.setRequestHeader("token", globalData.getCurToken());
								},
								success : function(res) {
									if(res.success){
										layer.msg(res.msg,{icon:1,time:2000},function(index){
											//table.reload('testReload');
										});
										
									}else{
										layer.msg(res.msg,{icon:2,time:2000});
									}
								}
							});
							return false;
						})
						break;
						case 'setRole':
							//获取全部角色
							$.ajax({
								type : "get",
								url : globalData.server+"roles/findAll",
								data:{},//需要传递到服务端的数据
								dataType:'json',//服务端响应数据类型
								xhrFields: {
									withCredentials: true
								},
								beforeSend: function(request) {
									request.setRequestHeader("token", globalData.getCurToken());
								},
								success : function(allData) {
									var	rData=new Array();
									//右侧角色
									$.ajax({
										type : "get",
										url : globalData.server+"user/getRolesByUserId",
										data:{
											id:data.id
										},//需要传递到服务端的数据
										dataType:'json',//服务端响应数据类型
										xhrFields: {
											withCredentials: true
										},
										beforeSend: function(request) {
											request.setRequestHeader("token", globalData.getCurToken());
										},
										success : function(res) {
											//获取用户拥有的角色id加入到集合
												if(res.length>0){
													for(var i=0;i<res.length;i++){
														rData.push(res[i].id);
													}
												}
												//渲染穿梭框
											transfer.render({
												elem:'#role_demo',
												title:['系统所有角色','当前用户角色'],
												data:allData,
												parseData:function(allData){
													return{
														'value':allData.id,
														'title':allData.name
													}
												},
												value:rData,
												id:'test1_id',
												onchange:function(obj,index){
													if(index=='0'){
														var roleids=[];
														//添加角色
														//循环获取要添加的角色id
														for(var i=0;i<obj.length;i++){
															//追加到集合中
															roleids.push(obj[i].value);
														}
														$.ajax({
															type : "get",
															url : globalData.server+"user/setRole",
															data:{
																id:data.id,
																roleids:roleids
															},//需要传递到服务端的数据
															dataType:'json',//服务端响应数据类型
															xhrFields: {
																withCredentials: true
															},
															beforeSend: function(request) {
																request.setRequestHeader("token", globalData.getCurToken());
															},
															success : function(res) {
																if(res.success){
																	layer.msg(res.msg,{icon:1,time:2000},function(index){
																		//table.reload('testReload');
																	});
																	
																}else{
																	layer.msg(res.msg,{icon:2,time:2000});
																}
															}
														});	
														
													}else{
														var roleids=[];
														//删除角色
														
														//循环获取要删除的角色id
														for(var i=0;i<obj.length;i++){
															//追加到集合中
															roleids.push(obj[i].value);
														}
														$.ajax({
															type : "get",
															url : globalData.server+"user/setRole",
															data:{
																id:data.id,
																roleids:roleids
															},//需要传递到服务端的数据
															dataType:'json',//服务端响应数据类型
															xhrFields: {
																withCredentials: true
															},
															beforeSend: function(request) {
																request.setRequestHeader("token", globalData.getCurToken());
															},
															success : function(res) {
																if(res.success){
																	layer.msg(res.msg,{icon:1,time:2000},function(index){
																		//table.reload('testReload');
																	});
																	
																}else{
																	layer.msg(res.msg,{icon:2,time:2000});
																}
															}
														});	
														
													}
												}
											});
										}
									});
								}
							});
							
							layer.open({
								type:1,
								title:'您正在设置用户['+data.loginname+']的角色',
								area: ['600px', '600px'],
								content:$("#role_tarsfer")
								//success:function()
							});
						break;
					}
				});
				
				//监听开关锁定事件
				form.on('switch(islockout)',function(data){
					//获取开关的value值
					//console.log(data);
					var elem=data.elem;
					var uid=elem.getAttribute("uid");
					//开关选中即为锁定状态，否则为解锁状态
					if(elem.checked){
						layer.confirm('确认锁定用户['+data.value+']吗?',{icon:3},function(index){
							layer.close(index);
							
							$.ajax({
								type : "get",
								url : globalData.server+"user/locktopic",
								data:{
									id:uid,
									islockout:"是"
								},//需要传递到服务端的数据
								dataType:'json',//服务端响应数据类型
								xhrFields: {
									withCredentials: true
								},
								beforeSend: function(request) {
									request.setRequestHeader("token", globalData.getCurToken());
								},
								success : function(res) {
									if(res.success){
										layer.msg(res.msg,{icon:1,time:1500},function(){
											table.reload('testReload');
										});
									}else{
										layer.msg(res.msg,{icon:2,time:1500});
									}
								}
							});
						},function(index){
							//撤销勾选操作
							data.elem.checked=false;
							form.render('checkbox');
						});
					}else{
						layer.confirm('确认解锁用户['+data.value+']吗?',{icon:3},function(index){
							layer.close(index);
							$.ajax({
								type : "get",
								url : globalData.server+"user/locktopic",
								data:{
									id:uid,
									islockout:"否"
								},//需要传递到服务端的数据
								dataType:'json',//服务端响应数据类型
								xhrFields: {
									withCredentials: true
								},
								beforeSend: function(request) {
									request.setRequestHeader("token", globalData.getCurToken());
								},
								success : function(res) {
									if(res.success){
										layer.msg(res.msg,{icon:1,time:1500},function(){
											table.reload('testReload');
										});
									}else{
										layer.msg(res.msg,{icon:2,time:1500});
									}
								}
							});
						},function(index){
							//撤销取消勾选操作
							data.elem.checked=true;
							form.render('checkbox');
						});
					}
				});
			});
			
			
		</script>
</html>
